import React, { memo, Suspense } from 'react'
import type { ReactNode } from 'react'
import { Outlet } from 'react-router-dom'
import NavBar from './c-cpns/nav-bar'

interface IProps {
  children?: ReactNode
}

const Discover: React.FC<IProps> = (props) => {
  return (
    <div>
      <div>
        <NavBar />
        {/* <Link to={'/discover/recommend'}>推荐</Link>
        <Link to={'/discover/ranking'}>排行榜</Link>
        <Link to={'/discover/songs'}>歌单</Link>
        <Link to={'/discover/djradio'}>主播电台</Link>
        <Link to={'/discover/artist'}>歌手</Link>
        <Link to={'/discover/album'}>新碟上架</Link> */}
      </div>
      <Suspense fallback="loading2...">
        <Outlet />
      </Suspense>
    </div>
  )
}

export default memo(Discover)
